import React from 'react'
import { connect } from 'dva'
import QueryString from 'querystring'
import Nav from '../components/Nav'
import Header from '../components/Header'
import Commodity from '../components/Commodity'



class Index extends React.Component {

    componentDidMount() {
        const { dispatch, location } = this.props
        
        let urlParam = location.search
        urlParam = urlParam.replace('?', '')
        urlParam = QueryString.parse(urlParam)

        dispatch({
            type: 'user/login',
            payload: urlParam.code
        })
    }

    pay = () =>{
        const { dispatch, user } = this.props
        // console.log(
        //     'openid: ',
        //     user.user.openid
        // )
        dispatch({
            type: 'user/pay',
            payload: user.user.openid
        })
    }

    render() {
        return (
            <div>
                <Header />
                
                <div className='commodityList'>
                    <button onClick={this.pay} >测试支付</button>
                    <Commodity />
                    <Commodity />
                    <Commodity />
                    <Commodity />
                    <Commodity />
                    <Commodity />
                    <Commodity />
                    <Commodity />
                </div>

                <Nav />
            </div>
        )
    }
}

const mapState = state => ({
    user: state.user
})

export default connect(mapState)(Index)
